<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>

</head>

<body>
    <script>
        // 分组（）------------------------------------------

        var str = "<div>{{name}}今年{{ age }}岁了</div>";
        var pattern = /{{\s*([\w]+)\s*}}/;
        var patternResult = pattern.exec(str);
        console.log(patternResult);
        // 结果： ["{{name}}", "name", index: 5, input: "<div>{{name}}今年{{ age }}岁了</div>", groups: undefined]



        // 多次replace----------------------------------------
        // var str = "<div>{{name}}今年{{ age }}岁了</div>";
        // var pattern = /{{\s*([\w]+)\s*}}/;
        // // 匹配一
        // var res1 = pattern.exec(str)
        // str = str.replace(res1[0], res1[1])
        // console.log(str);
        // // 匹配二
        // var res2 = pattern.exec(str)
        // str = str.replace(res2[0], res2[1])
        // console.log(str);
        // // 匹配三值为null
        // var res3 = pattern.exec(str)
        // console.log(res3);

        // 使用循环replace----------------------------------------
        // var str = "<div>{{name}}今年{{ age }}岁了</div>";
        // var pattern = /{{\s*([\w]+)\s*}}/;
        // var patternResult = null;
        // while (patternResult = pattern.exec(str)) {
        //     str = str.replace(patternResult[0], patternResult[1]);
        // }
        // console.log(str);
        // // 使用反向引用分组-------------------
        var str = "<div>{{name}}今年{{ age }}岁了</div>";
        var pattern = /{{\s*([\w]+)\s*}}/g;
        str = str.replace(pattern, '$1')
        console.log(str);

        // 输出：<div>name今年age岁了</div>
//         // exec()---------------------------------
//         var str = 'hello';
//         var pattern = /o/;
//         console.log(pattern.exec(str));
// // 输出结果：["o", index: 4, input: "hello", groups: undefined]
    </script>
</body>

</html>